<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="s" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="<s:url value="/assets/web/css/base.css"></s:url>"><!-- 基本框css -->
    <link rel="stylesheet" href="<s:url value="/assets/web/css/login/bootstrap.min.css?v=3.3.6"></s:url>">
    <link rel="stylesheet" href="<s:url value="/assets/web/css/base_nav.css"></s:url>">

    <link rel="stylesheet" href="<s:url value="/assets/web/css/user/projectInfo.css"></s:url>">
    <title>节点详情</title>
    <style>
        /* 显示区域边距 */
        #content-main {
            padding: 10px 0px 0;
        }

        .child1 {
            top: 3px;
            left: 3px;
        }

        /*菜单修改*/
        /*.nav-left {*/
        /*top: 47px;*/
        /*}*/

        /*下拉列表*/
        .clear-list > li:first-child {
            margin-left: 35px;
        }

        .clear-list > li:nth-child(2) {
            position: absolute;
            top: 0;
            left: 18%;
        }

        .clear-list > li:nth-child(3) {
            position: absolute;
            top: 0;
            left: 35%;
        }

        .clear-list > li:nth-child(4) {
            position: absolute;
            top: -3px;;
            left: 49%;

        }

        .clear-list > li:nth-child(5) {
            position: absolute;
            top: -3px;;
            left: 60%;

        }

        .clear-list > li:nth-child(6) {
            position: absolute;
            top: -3px;;
            left: 75%;
        }

        .clear-list > li:nth-child(7) {
            margin-left: -70px;
            margin-top: 45px;
        }

        /*  !*修改按钮*!
          .clear-list > li:nth-child(7) {
              position: absolute;
              left: 90%;
              display: inline-block;
              margin: 0 10px;
              width: 60px;
              height: 30px;
              background: #337ab7;
              color: #ffffff;
              border-radius: 5px;
              font-size: 13px;
              text-align: center;
              line-height: 30px;
              cursor: pointer;
          }*/

        .button_css {
            /*position: absolute;*/
            /*left: 85%;*/
            float: right;
            padding: 0 10px;
            display: inline-block;
            margin: 0 10px;
            height: 30px;
            border-radius: 5px;
            font-size: 13px;
            text-align: center;
            line-height: 30px;
            cursor: pointer;
        }

        .left_css {
            position: absolute;
            left: 76%;
            margin-top: 7px;
        }

        .jd-block {
            width: 100%;
        }

        /*实际完成时间*/
        .actual-times {
            /*position: absolute;*/
            /*left: 70%;*/
            float: right;
            display: inline-block;
            margin-top: 4px;
        }

        .jd-block .update {
            display: inline-block;
            margin: 0 10px;
            width: 60px;
            height: 30px;
            background: #337ab7;
            color: #ffffff;
            border-radius: 5px;
            font-size: 13px;
            text-align: center;
            line-height: 30px;
            cursor: pointer;
        }

        .total-title {
            font-size: 17px;
            margin-left: 30px;
            margin-right: 20px;
        }

        .drop-list .open + ul {
            height: 70px;
        }

        .clear-list > li:nth-child(8), .clear-list > li:nth-child(10) {
            margin-left: 70px;
            margin-top: 45px;
        }

        .clear-list > li:nth-child(9), .clear-list > li:nth-child(11) {
            position: absolute;
            top: 31px;
            left: 45%;
        }

    </style>
</head>

<body class="bgcolor">
<%@ include file="/WEB-INF/views/modules/commons/nav.jsp" %>
<%@ include file="/WEB-INF/views/modules/commons/menu.jsp" %>
<table></table>
<!-- 窗口显示区 -->
<div class="av row J_mainContent" id="content-main">
    <div class="container">
        <%--通不通过模态框--%>
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <%--确认通过--%>
            <div class="modal-dialog  through-or-no-1">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" style="text-align: center;">确认该项目通过吗？</h4>
                    </div>
                    <div class="modal-footer" id="passY">
                        <form role="form" action="<s:url value="/projectManger/pass"></s:url>">
                            <input type="text" class="sysid" name="sysId" placeholder="" style="display: none">
                            <button type="submit" class="btn btn-primary">确认</button>
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        </form>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
            <%--不通过--%>
            <div class="modal-dialog  through-or-no-2">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" style="text-align: center;">确认该项目不能通过吗？</h4>
                    </div>
                    <div class="modal-footer" id="passN">
                        <form role="form" action="<s:url value="/projectManger/noPass"></s:url>">
                            <input type="text" class="sysid" name="sysId" placeholder="" style="display: none">
                            <button type="submit" class="btn btn-primary">确认</button>
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        </form>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
        </div>
        <%--配置节点信息--%>
        <div class="config">
            <%--<p class="config-nav">--%>
            <%--<span>--%>
            <%--<a href="#">首页</a>&nbsp;&gt;&nbsp;--%>
            <%--</span>--%>
            <%--<span>--%>
            <%--<a href="#">创建新项目</a>&nbsp;&gt;&nbsp;--%>
            <%--</span>--%>
            <%--<span>--%>
            <%--<a href="#">配置项目节点</a>&nbsp;&gt;&nbsp;--%>
            <%--</span>--%>
            <%--</p>--%>
            <div class="config-title">
                <p>
                    <span>项目名称 :</span>
                    <span>${projectList.name}</span>
                </p>
                <p>
                    <span>项目状态 :</span>
                    <span>${projectList.status == "1" ? "待审批部门确认节点" :
                                projectList.status == "2" ? "管理员未审核":
                                    projectList.status == "3" ? "项目进行中":
                                        projectList.status == "4" ? "已完成":
                                            projectList.status == "5" ? "审核不通过，请重新配置节点信息": "项目已暂停"}</span>
                </p>
                <p>
                    <span>责任单位 :</span>
                    <span>${projectList.resDept}</span>
                </p>
                <p class="hide-content">
                    <span>项目联系人 : </span>
                    <span>${projectList.contactName}</span>
                </p>
                <p class="hide-content">
                    <span>分管领导 : </span>
                    <span>${projectList.resUser}</span>
                </p>
                <p class="hide-content">
                    <span>征迁实施单位 : </span>
                    <span>${projectList.occupyDept}</span>
                </p>
                <p class="hide-content">
                    <span>征迁责任人 : </span>
                    <span>${projectList.occupyResUser}</span>
                </p>
                <p class="hide-content">
                    <span>征迁经办人 : </span>
                    <span>${projectList.occupyOperateUser}</span>
                </p>
                <p class="hide-content">
                    <span>计划投资总额(万元) : </span>
                    <span>${projectList.money}</span>
                </p>
                <p class="hide-content">
                    <span>初步选址 : </span>
                    <span>${projectList.address}</span>
                </p>
                <p class="hide-content">
                    <span>行业类型 : </span>
                    <span>${projectList.natureType == '0' ? '政府投资类' : projectList.natureType == '1' ? '企业投资类' : '土地收储类'}</span>
                </p>
                <p class="hide-content">
                    <span>建设内容 : </span>
                    <span>${projectList.describes }</span>
                </p>
                <p class="open-list">展开更多信息 v</p>
            </div>
            <%--通过或不通过的按钮--%>
            <c:if test="${projectList.status == 2}">

                <p class="throug-button">
                    <span class="through" data-sysId="${projectList.sysId}" data-toggle="modal" data-target="#myModal">通过</span>
                    <span class="no-through" data-sysId="${projectList.sysId}" data-toggle="modal"
                          data-target="#myModal">不通过</span>
                </p>
            </c:if>
            <%--表格--表格--%>
            <c:if test="${projectList.status == 0 || projectList.status == 1}">
                <div class="table-tb">
                    <table class="project-info" border="0">
                        <thead>
                        <tr>
                            <th>节点名称</th>
                            <th>审核部门</th>
                            <th>创建时间</th>
                            <th>审核状态</th>
                            <th>审核时间</th>
                        </tr>
                        </thead>
                        <c:forEach var="list" items="${nodeList}">
                            <c:if test="${list.type == '1'}">
                                <tbody>
                                <tr>
                                    <td>${list.nodeId} ${list.nodeName}</td>
                                    <td>${list.resDept}</td>
                                    <td>${list.createDate}</td>
                                    <td>${list.state == '1' ? '部门需要' : list.state=='2' ? '部门不需要' : list.state=='3'?'业主已配置' :'未确定'}</td>
                                    <td>${list.updDate}</td>
                                </tr>
                                </tbody>
                            </c:if>
                        </c:forEach>
                    </table>
                </div>
            </c:if>
            <!-- 项目建议书 -->
            <c:if test="${projectList.status != 0 || projectList.status != 1}">


                <div class="config-content">
                    <div class="jd-block">
                        <div style="margin: 5px 0 !important;">
                            <i style="font-size: 20px; color: red;"></i>
                            <span class="total-title">&#8226 未完成节点总共${noFinishNodeNum}个,(${strBufNoFinish})-计划用时:${planUseTime}天;</span>
                        </div>
                        <div style="margin: 5px 0 !important;">
                            <i style="font-size: 20px; color: red;"></i>
                            <span class="total-title">&#8226 进行中节点总共${doingNodeNum}个,(${strBufBegin})-计划用时:${planTimeInBegin}天;</span>
                        </div>
                        <div style="margin: 5px 0 !important;">
                            <i style="font-size: 20px; color: red;"></i>
                            <span class="total-title">&#8226 已完成节点总共${finishedNodeNum}个,(${strBufFinish})-实际用时:${factUseTime}天。</span>
                        </div>
                        <div style="margin: 5px 0 !important;">
                            <i style="font-size: 20px; color: red;"></i>
                            <span class="total-title">&#8226 所有节点（已完成、未完成、进行中）计划用时:${planUseTimeAll}天;</span>
                        </div>
                        <div style="margin: 5px 0 !important;">
                            <i style="font-size: 20px; color: red;"></i>
                            <span class="total-title">&#8226 所有节点（已完成、未完成、进行中）实际用时:${factUseTimeAll}天;</span>
                        </div>
                        <div style="margin: 5px 0 !important;">
                            <i style="font-size: 20px; color: red;"></i>
                            <span class="total-title">&#8226 总共进行过&nbsp;【<a href="/projectManger/queryNode?sysId=${sysId}&supervisionFlag=true">${supervisionCount}次</a>】&nbsp;督查;</span>
                            <span class="total-title">【<a href="/projectManger/queryNode?sysId=${sysId}">查看所有节点</a>】</span>
                        </div>
                        <div style="margin: 5px 0 !important;">
                            <i style="font-size: 20px; color: red;"></i>
                            <span class="total-title">&#8226 进入督查的节点有:&nbsp;&nbsp;${taskNodes}。</span>
                        </div>
                    </div>
                    <c:forEach var="list" items="${nodeList}">
                        <div class="jd-block">
                            <c:if test="${list.type == '1'}">
                                <div class="element1 left">
                                    <div class="child1"></div>
                                </div>
                                <span class="total-title">${list.nodeId} ${list.nodeName}</span>
                                <span style=" margin-rigt:40px">
                                    计划用时:<em>${list.planTime}天</em>
                                </span>
                                <span style=" margin-rigt:40px">
                                    实际用时:<em>${list.factTime}天</em>
                                </span>
                                <%--<c:if test="${projectList.status != 3}">--%>
                                <%--<em class="left_css">节点状态：${list.state == '1' ? '部门需要' : list.state=='2' ? '部门不需要' : list.state=='3'?'业主已配置' :'未确定'}</em>--%>
                                <%--</c:if>--%>
                                <%--<c:if test="${projectList.status != 3}">--%>

                                <%--大节点修改时间的功能去掉，取消大节点处的修改功能--%>
                                <%--<span class="update" style="float: right;" data-nodeId="${list.nodeId}"--%>
                                <%--data-title="${list.nodeId} ${list.nodeName}" data-toggle="modal"--%>
                                <%--data-target="#myModal-update">修改--%>
                                <%--</span>--%>

                                <div class="btn-group  button_css" style="cursor: default !important;">
                                    <c:if test="${list.state == 2}">
                                                 <span style="font-size: 14px;
                                                 color: #fff;
                                                 padding: 5px;
                                                 border-radius: 4px;
                                                 background-color: red;">
                                                 节点不需要
                                                 </span>
                                    </c:if>
                                    <c:if test="${list.state == 1}">
                                                <span style="font-size: 14px;
                                                 color: #fff;
                                                 padding: 5px;
                                                 border-radius: 4px;
                                                 background-color: green;">
                                                节点需要
                                                </span>
                                    </c:if>
                                    <c:if test="${list.state == 0}">
                                                <span style="font-size: 14px;
                                                 color: #fff;
                                                 padding: 5px;
                                                 border-radius: 4px;
                                                 background-color: blue;">
                                                节点未确定需不需要
                                                </span>
                                    </c:if>
                                    <c:if test="${list.state == null}">
                                                <span style="font-size: 14px;">

                                                </span>
                                    </c:if>
                                </div>
                                <%--</c:if>--%>
                                <div class="actual-times">
                                    <span class="actual-completion-time">
                                            <c:if test="${list.planBeginDate != null}">
                                                开始时间：${list.planBeginDate}
                                            </c:if>
                                            <c:if test="${list.planBeginDate == null}">
                                                计划开始时间：${list.planBeginTime}
                                            </c:if>
                                            </span>&nbsp;&nbsp;

                                    <span class="actual-completion-time">实际完成时间：
                                            <c:if test="${list.factFinishDate == null}">
                                                暂无
                                            </c:if>
                                            <c:if test="${list.factFinishDate != null}">
                                                ${list.factFinishDate}
                                            </c:if>
                                            </span>&nbsp;&nbsp;
                                        <%-- <button data-nodeid="${list.nodeId}" data-projectid="${list.projectId}"
                                                 class="update-time btn  btn-sm  btn-primary">更新时间
                                         </button>--%>
                                </div>
                            </c:if>
                            <c:if test="${list.type == '2'}">
                            <ul class="drop-list">
                                <li>
                                    <span class="open">${list.nodeId} ${list.nodeName}&nbsp;&nbsp;&nbsp;
                                        <em>∧</em>
                                    </span>
                                    <ul class="clear-list">
                                        <li>
                                            状态：
                                            <c:if test="${list.isDelay == -1}">
                                                <em>未完成</em>
                                            </c:if>
                                            <c:if test="${list.isDelay == 0}">
                                                <em>正常</em>
                                            </c:if>
                                            <c:if test="${list.isDelay == 1}">
                                                <em>逾期</em>
                                            </c:if>
                                            <c:if test="${list.isDelay == 2}">
                                                <em>超前</em>
                                            </c:if>
                                        </li>
                                        <li>
                                            负责人：
                                            <em>${list.resUser}</em>
                                        </li>
                                        <li>
                                            经办人：
                                            <em>${list.operatorUser}</em>
                                        </li>
                                        <li>
                                            计划用时：
                                            <em>${list.planTime}天</em>
                                        </li>
                                        <li>
                                            实际用时：
                                            <em>${list.factTime}天</em>
                                        </li>
                                        <li>
                                            <c:if test="${projectList.status != 3}">
                                                <em>${list.state == '1' ? '部门需要' : list.state=='2' ? '部门不需要' : list.state=='3'?'业主已配置' :'未确定'}</em>
                                            </c:if>
                                            <c:if test="${projectList.status == 3}">
                                                <em>${list.status == "0" ? "未开始" : list.status=='1'? '开始':'结束'}</em>
                                            </c:if>
                                        </li>
                                            <%--修改按钮--%>
                                            <%-- <li class="update" data-nodeId="${list.nodeId}"
                                                 data-title="${list.nodeId} ${list.nodeName}" data-toggle="modal"
                                                 data-target="#myModal-update">修改
                                             </li>--%>
                                        <c:if test="${list.status == '2'}">
                                            <c:if test="${list.planBeginDate != null}">
                                                <li>
                                                    实际开始时间:
                                                    <em>${list.planBeginDate}</em>
                                                </li>
                                            </c:if>
                                            <c:if test="${list.factFinishDate != null}">
                                                <li>
                                                    实际结束时间:
                                                    <em>${list.factFinishDate}</em>
                                                </li>
                                            </c:if>
                                        </c:if>
                                        <c:if test="${list.status == '1'}">
                                            <c:if test="${list.planBeginDate != null}">
                                                <li>
                                                    实际开始时间:
                                                    <em>${list.planBeginDate}</em>
                                                </li>
                                            </c:if>
                                            <c:if test="${list.planBeginTime != null}">
                                                <li>
                                                    计划结束时间:
                                                    <em>${list.planEndTime}</em>
                                                </li>
                                            </c:if>
                                        </c:if>
                                        <c:if test="${list.status == '0'}">
                                            <c:if test="${list.planBeginTime != null}">
                                                <li>
                                                    计划开始时间:
                                                    <em>${list.planBeginTime}</em>
                                                </li>
                                            </c:if>
                                            <c:if test="${list.planBeginTime != null}">
                                                <li>
                                                    计划结束时间:
                                                    <em>${list.planEndTime}</em>
                                                </li>
                                            </c:if>
                                        </c:if>
                                            <%--进入督查--%>
                                        <c:if test="${list.taskId != null}">
                                            <li style="font-weight: bold;">
                                                <div class="badge  pull-left reds"
                                                     style="background-color: #d15b47 !important;">!
                                                </div>
                                                &nbsp;&nbsp;该节点已&nbsp;<a
                                                    href="/missions?taskId=${list.taskId}">进入督查</a>&nbsp;(督查${list.taskTimes}次)
                                            </li>
                                        </c:if>
                                    </ul>
                                </li>
                                </c:if>
                            </ul>
                        </div>

                    </c:forEach>
                </div>

            </c:if>

            <!-- 提交、修改按钮 -->
            <div class="button-list">
                <!-- <a class="submit" href="#">确定</a> -->
                <%--<a class="revise" href="#">返回修改</a>--%>
            </div>
        </div>
    </div>
</div>
<%--修改模态框--%>
<div class="modal fade" id="myModal-update" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <p class="node-title" style="display: inline-block;font-size: 20px;font-weight: bold; margin: 0;"></p>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <div class="module-node-name">
                    <p>实际开始时间</p>
                    <p>实际结束时间</p>
                    <p>计划用时</p>
                    <p>实际用时</p>
                    <p>节点状态</p>
                    <p>节点是否需要</p>
                </div>
            </div>
            <form action="">
                <div class="modal-body text-center">
                    <div class="div-input">
                        <input name="planBeginDate" class="plan-start-time" type="text" id="J-xl-1">
                    </div>
                    <div class="div-input">
                        <input name="factEndDate" class="finish-time" type="text" id="J-xl-2">
                    </div>
                    <div class="div-input">
                        <input name="planTime" id="planTime" class="plan-time" type="number" min="0">
                    </div>
                    <div class="div-input">
                        <input name="factTime" id="factTime" class="actual-time" type="number" readOnly="true">
                    </div>
                    <div class="div-input">
                        <select name="status" id="status" class="node-status">
                            <option value="">未知</option>
                            <option value="0">未开始</option>
                            <option value="1">已开始</option>
                            <option value="2">结束</option>
                        </select>
                    </div>
                    <div class="div-input">
                        <select name="state" id="state" class="node-state">
                            <option value="0">未确定</option>
                            <option value="1">需要</option>
                            <option value="2">不需要</option>
                        </select>
                    </div>
                    <input hidden type="text" id="sysId" name="sysId" class="node-stysid">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" id="sub">提交更改</button>
                </div>
            </form>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<script src="<s:url value="/assets/web/js/jquery.min.js"></s:url>"></script>
<script src="<s:url value="/assets/web/js/bootstrap.min.js"></s:url>"></script>
<script src="<s:url value="/assets/web/common/bootstrapvalidator/dist/js/bootstrapValidator.js"></s:url>"></script>
<script src="<s:url value="/assets/web/js/baseAPI.js"></s:url>"></script>
<script>
    $(function () {
        // 下拉列表
        $(".drop-list").dropList();

        // 展开更多
        $(".open-list").click(function () {
            console.log(1);
            if ($(".hide-content").is(":hidden")) {
                $(".hide-content").css("display", "block");
                $(this).text("隐藏部分内容 ∧");
            } else {
                $(".hide-content").css("display", "none");
                $(this).text("展开更多信息 v");
            }
        });

        <%--确认通过不的显示或隐藏--%>
        $(".through").on("click", function () {
            $(".through-or-no-2").hide();
            $(".through-or-no-1").show();
            var lid = $(this).data("sysid"); //用户名
            console.log(this);
            console.log(lid);
            $("#passY>form>input").val(lid);
        });

        $(".no-through").on("click", function () {
            $(".through-or-no-2").show();
            $(".through-or-no-1").hide();
            var lid = $(this).data("sysid"); //用户名
            console.log(this);
            console.log(lid);
            $("#passN>form>input").val(lid);
        });

    })

</script>
</body>
</html>